<template>
  <view class="Home">
    <view class="hometitle">
      <view style="margin-bottom: 12rpx;">
        <text class="home-title-top">贴心陪伴 让服务更便捷</text>
      </view>
      <view>
        <text class="home-title-bottom">一站式国际物流供应链协作服务中心</text>
      </view>
    </view>
    <image class="homebackground" mode="scaleToFill" src="@/static/workbench/bg.png"></image>
    <view class="logo">
      <image mode="scaleToFill" src="@/static/workbench/logo.svg"></image>
    </view>
  </view>
  <!-- 内容区 -->
  <view class="workbench-container">
    <!-- 运价查询 -->
    <view class="freight-inquiry">
      <image @click="goSwitchTab('/pages/tabbar/freightHome/freightHome')" class="freight-imagr" src="@/static/workbench/freight_search.png" style="height: 168rpx;width: 100%;">
      </image>
    </view>
    <!-- 工作台点击 -->
    <view class="workcontent">
      <view class="padding-bottom">
        <view class="nav-item" @click="goRouter('/bookingPackages/bookingHome/bookingHome')">
          <image src="@/static/workbench/item1.png"></image>
          <view>现舱查询</view>
        </view>
        <view class="nav-item" @click="goSwitchTab('/pages/tabbar/cargoTrackHome/cargoTrackHome')">
          <image src="@/static/workbench/item2.png"></image>
          <view>货物跟踪</view>
        </view>
        <view class="nav-item" @click="goRouter('/tablePackages/vesselTable/vesselTable')">
          <image src="@/static/workbench/item3.png"></image>
          <view>船期表</view>
        </view>
        <view class="nav-item" @click="goRouter('/tablePackages/vesselCompanyLetter/vesselCompanyLetter')">
          <image src="@/static/workbench/item4.png"></image>
          <view>保函下载</view>
        </view>
      </view>
    </view>
    <!-- 新闻列表 -->
    <view class="news-list">
      <view class="new-list-title" @click="goNewsList">
        <view class="left">
          <image src="@/static/workbench/news.svg" style="width:33rpx;height:33rpx;margin-right: 22rpx;">
          </image>
          <text>热门资讯</text>
        </view>
        <!-- <image src="../image/right.svg" style="width:24rpx;height:24rpx;"  ></image> -->
        <uv-icon name="arrow-right" color="#303030"></uv-icon>
      </view>
      <view class="new-list-cotent" v-for="item in newsList" @click="goNewsDetail(item.content.news_item[0])">
        <view class="new-title-cotent-container">
          <view class="new-list-cotent-title">{{item.content.news_item[0].title}}</view>
          <view class="new-list-cotent-time">{{item.update_time}}</view>
        </view>
        <image :src="item.content.news_item[0].thumb_url" mode="aspectFill"></image>
      </view>
      <view class="empty" v-if="newsList.length==0">
        <uv-empty text="暂无热门资讯" mode="list" icon="/static/empty.png"></uv-empty>
      </view>
    </view>
  </view>
</template>

<script>
	import appAuthPopup from '@/pages/components/app-auth-popup/app-auth-popup'
	import store from '@/store'
	import {
		serverPort
	} from '@/utils/request'
	import customRouter from '@/utils/customRouter.js'
	import request from '@/utils/request'
	import {
		formatDateText
	} from '@/utils/times.js'
	export default {
		data() {
			return {
				newsList: []
			}
		},
		methods: {
			getNewsList() {
				let _this = this
				request.get('/api/Wechat/GetArticleList', {
					Page: 1,
					Limit: 10
				}).then(res => {
					if (!res.Data.item || res.Data.item.length < 1) return
					res.Data.item.forEach((t) => {
						console.log(t.update_time);
						t.update_time = formatDateText(t.update_time, 'number')
					})
					this.newsList = res.Data.item
				})
			},
			goNewsDetail(item) {
				getApp().globalData.newsDetailUrl = item.url
				customRouter.navigateTo(({
					url: `/pages/tabbar/workbench/newsDetail/newsDetail`
				}))
			},
			goNewsList() {
				customRouter.navigateTo({
					url: '/pages/tabbar/workbench/newsList/newsList'
				})
			},
			goRouter(url) {
				if (!url) return
				customRouter.navigateTo({
					url
				})
			},
			goSwitchTab(url){
				if (!url) return
				customRouter.switchTab({
					url
				})
			}
		},
		created() {
			this.getNewsList()
		}
	}
</script>

<style lang="scss" scoped>
@import './workbench.scss'
</style>